window.count = 0;
(function($){
	$(".backBtn").on('tap', function() {
		$.mobile.changePage("driver-main.html");
	});
	
	$(document).bind("pageshow", function() {
		WL.Logger.info("PAGE BEGIN");
		if (window.count == 0) {
			WL.Logger.info("chartInit");
			chartInit();
		}
	});
	
	$("#pie-chart-btn").on('click',function(){	
		WL.Logger.info("button click");
		drawPieChart();
	});
	$("#Horizontal-bar-chart-btn").on('click',function(){	
		WL.Logger.info("button click");
		drawHorizontalBarChart();
	});
	$("#Pareto-chart-btn").on('click',function(){	
		WL.Logger.info("button click");
		drawParetoChart();
	});

})(jQuery);


/*
//dynamic statistics
var canvas = document.getElementById('testCanvas');
var ctx = canvas.getContext('2d');
ctx.strokeStyle = 'red';
ctx.lineJoin = 'bevel';
ctx.miterLimit = 5;


function changeFun() {
    ctx.clearRect(0, 0, 300, 300);
    ctx.beginPath();
    var arr = [];
    for(var i=0; i< 30; i++ )
    {
        var random = Math.random();
        random = parseInt(random * 100 % 100 + 1);
        arr.push(random);
    }

    var x = 0;
    for(var i=0; i< 30; i++ )
    {
        var y = arr[i]+50;
            
        ctx.lineTo(x, y);

        ctx.fillText(x+','+100, x-3, y);
        ctx.moveTo(x, y);
        x = x + 35;
    }
    ctx.stroke();
};
setInterval(changeFun,3000);
*/

mychart1 = new AwesomeChart('canvas1');
mychart2 = new AwesomeChart('canvas2');
mychart3 = new AwesomeChart('canvas3');

function chartInit() {	
	$("#canvas2").addClass("hidden");
	$("#canvas3").addClass("hidden");
	$("#canvas1").removeClass("hidden");
		
	if(!!document.createElement('canvas').getContext){ //check that the canvas
        // element is supported
		mychart1.title = "2013-8 Passenger Capacities";
		mychart1.data = [244, 344, 100, 29, 9];
		mychart1.labels = ["week 1", "week 2", "week 3", "week 4", "week 5"];
		mychart1.colors = ['#006CFF', '#FF6600', '#34A038', '#945D59', '#93BBF4'];
		mychart1.randomColors = true;
		mychart1.chartType = 'pie';
		mychart1.animate = true;
		mychart1.draw();
	}
	
	if(!!document.createElement('canvas').getContext){ //check that the canvas
        // element is supported
		//var mychart = new AwesomeChart('canvas2');
		mychart2.title = "2013-8 Passenger Capacities";
		mychart2.data = [244, 344, 100, 29, 9];
		mychart2.labels = ["week 1", "week 2", "week 3", "week 4", "week 5"];
		mychart2.colors = ['#006CFF', '#FF6600', '#34A038', '#945D59', '#93BBF4'];
		mychart2.randomColors = true;
		mychart2.animate = true;
		mychart2.animationFrames = 30;
		mychart2.draw();
	}
	
	if(!!document.createElement('canvas').getContext){ //check that the canvas
        // element is supported
		//var mychart = new AwesomeChart('canvas3');
		mychart3.title = "2013-8 Passenger Capacities";
		mychart3.data = [244, 344, 100, 29, 9];
		mychart3.labels = ["week 1", "week 2", "week 3", "week 4", "week 5"];
		mychart3.colors = ['#006CFF', '#FF6600', '#34A038', '#945D59', '#93BBF4'];
		mychart3.randomColors = true;
		mychart3.chartType = 'pareto';
		mychart3.chartLineStrokeStyle = 'rgba(0, 0, 200, 0.5)';
		mychart3.chartPointFillStyle = 'rgb(0, 0, 200)';
		mychart3.draw();
	}
	//drawParetoChart();
	drawPieChart();
	window.count++;
}

function drawPieChart(){
	$("#canvas2").addClass("hidden");
	$("#canvas3").addClass("hidden");
	$("#canvas1").removeClass("hidden");
	    
 }

function drawHorizontalBarChart(){
	$("#canvas1").addClass("hidden");
	$("#canvas3").addClass("hidden");
	$("#canvas2").removeClass("hidden");
	
 }

function drawParetoChart(){
	$("#canvas1").addClass("hidden");
	$("#canvas2").addClass("hidden");
	$("#canvas3").removeClass("hidden");
	
 }
